import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import Components from 'unplugin-vue-components/vite';
import { VantResolver } from 'unplugin-vue-components/resolvers';
import postCssPxToRem from 'postcss-pxtorem'
import AutoImport from 'unplugin-auto-import/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'

// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => {
  const env = loadEnv(mode, process.cwd())
  const timestamp = new Date().getTime();

  return {
    plugins: [
      vue(),
      Components({
        resolvers: [VantResolver()]
      }),
      AutoImport({
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
    ],
    publicDir: "public",
    base: env.VITE_APP_PATH,
    resolve: {
      alias: {
        // '@': path.resolve('./src')
        "@": path.resolve(__dirname, "./src"),
        'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js'
      }
    },
    css: {
      postcss: {
        plugins: [
          postCssPxToRem({
            rootValue: 37.5, // 设计稿宽度的10%, 当前设计稿iPhone6的宽度375px
            rootValuePC: 192, // 原本用于在postcss-pxtorem/index.js源码中根据filePath来动态设置rem的base font-size, 本地有效, 打包后无效, 估弃用
            propList: ['*'],
            selectorBlackList: ['.el-'], // 对 css 选择器进行忽略的数组, 设置为 ['.el-']，那所有.el-类名里面有关 px 的样式将不被转换
            exclude: /(node_module|src\/views\/web)/ // 忽略转换的文件路径, 可使用正则匹配
          })
        ],
      },
      preprocessorOptions: {
        less: {
          modifyVars: {
            hack: `true; @import (reference) "${path.resolve("src/style/variable.less")}";`
          },
          javascriptEnabled: true,
        }
      },
    },
    server: {
      host: '0.0.0.0',
      port: 8090,
      cors: true, // 允许跨域
      proxy: {
        "/api": {
          target: env.VITE_BASE_URL,
          changeOrigin: true,
          secure: false,
          rewrite: (path) => path.replace(/^\/api/, ''),
        },
      },
    },
    build: {
      // outDir: 'robotWelcomeMobile',
      outDir: 'robotWelcome',
      rollupOptions: {
        // 输出配置
        output: {
          // 输出的文件自定义命名
          chunkFileNames: `js/[name]-[hash].${timestamp}.js`,
          entryFileNames: `js/[name]-[hash].${timestamp}.js`,
          assetFileNamesL: `[ext]/[name]-[hash].${timestamp}.[text]`,
        }
      },
    },
  }
})
